<script>
import {addOrUpdateOrderApi} from "@/axios/api/Order";
import {Select} from "@element-plus/icons-vue";

export default {
  name: "OrderEdit",
  components: {Select},
  props: [],
  data() {
    return {
      statusList: ['已支付', '待支付'],
      orderEditVisible: false,
      form: {
        id: '',
        customerName: '',
        customerPhone: '',
        time: '',
        totalPrice: '',
        status: '',
        carName: '',
        carImage: '',
      },
    }
  },
  methods: {
    onSubmit() {
      const data = {
        "id": this.form.id,
        "customerName": this.form.customerName,
        "customerPhone": this.form.customerPhone,
        "time": this.form.time,
        "status": this.form.status,
        "totalPrice": this.form.totalPrice,
        "carImage": this.form.carImage,
        "carName": this.form.customerName
      }
      addOrUpdateOrderApi(data).then(response => {
        console.log(response)
      })
      this.orderEditVisible = false
    },
    updateOrder(data) {
      this.form = data
    },
  }
}

</script>

<template>
  <!--  <el-button type="success" round @click="addEarthquakeVisible=true"  style="margin: 5px" icon="el-icon-plus">添加地震</el-button>-->
  <el-dialog
      v-model="orderEditVisible"
      title="订单信息"
      width="50%"
  >
    <el-form
        ref="form"
        :model="form"
        label-width="120px"
        label-position="left"
    >
      <el-form-item label="订单编号" prop="id">
        <el-input placeholder="系统自动生成，无需输入" disabled v-model="form.id"></el-input>
      </el-form-item>
      <el-form-item label="客户名字" prop="customerName">
        <el-input placeholder="请输入客户名字" v-model="form.customerName"></el-input>
      </el-form-item>
      <el-form-item label="客户联系方式" prop="customerPhone">
        <el-input placeholder="请输入客户联系方式" v-model="form.customerPhone"></el-input>
      </el-form-item>
      <el-form-item label="下单时间" prop="time">
        <el-input placeholder="系统自动生成，无需输入" disabled v-model="form.time"></el-input>
      </el-form-item>
      <el-form-item label="总价格" prop="totalPrice">
        <el-input placeholder="请输入总价格" v-model="form.totalPrice"></el-input>
      </el-form-item>
      <el-form-item label="订单状态" prop="status">
        <!--        <el-input placeholder="请输入订单状态" v-model="form.status"></el-input>-->
        <el-select v-model="form.status" placeholder="选择性别">
          <el-option
              v-for="item in statusList"
              :key="item"
              :label="item"
              :value="item"
          />
        </el-select>
      </el-form-item>
      <el-form-item label="汽车名字" prop="carName">
        <el-input placeholder="请输入汽车名字" v-model="form.carName"></el-input>
      </el-form-item>
      <el-form-item label="汽车图片链接" prop="carImage">
        <el-input placeholder="请输入汽车图片链接" v-model="form.carImage"></el-input>
      </el-form-item>
      <el-form-item style="text-align: center;">
        <el-button
            type="primary"
            @click="onSubmit"
        >
          提交
        </el-button>
        <el-button @click="orderEditVisible=false">
          取消
        </el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>

<style scoped>

</style>